<#include "/main.ftl"/>
<body>
<@diamondNav/>
<div id="content" style="margin-left: 13%">
    <div class="panel-body" style="padding-bottom:0px;">
        <div class="panel panel-default">
            <div class="panel-heading">查询条件</div>
            <div class="panel-body" style="padding:2px">
                <form id="formSearch" class="form-horizontal">
                    <div class="" style="margin-top:15px">
                        <div class="" style="margin-top:15px">
                            <label class="control-label col-sm-1" for="interfaceType">模块</label>
                            <div class="col-sm-3">
                                <select id="interfaceType" class="form-control">
                                    <option value="http">http</option>
                                    <option value="webService">webService</option>
                                    <option value="restful">restful</option>
                                    <option value="dubbo">dubbo</option>
                                </select>
                            </div>
                            <label class="control-label col-sm-1" for="testCaseName">用例名称</label>
                            <div class="col-sm-3">
                                <input type="text" class="form-control" id="testCaseName">
                            </div>

                            <div class="col-sm-4" style="text-align:left;">
                                <button type="button" style="margin-left:50px" id="btn_query" class="btn  btn-success btnFont">
                                    查询
                                </button>
                                <button type="button" style="margin-left:50px" id="btn_back" class="btn  btn-success btnFont">
                                    返回
                                </button>
                            </div>
                        </div>
                </form>

            </div>
        </div>

        <div id="toolbar" class="btn-group">
            <button id="btn_add" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>新增
            </button>
            <button id="btn_edit" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>修改
            </button>
            <button id="btn_delete" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>删除
            </button>
            <button id="" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-wrench" aria-hidden="true"></span>复制用例
            </button>
            <button id="btn_runTest" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-play" aria-hidden="true"></span>执行用例
            </button>

        </div>
        <table id="dataTable"></table>
    </div>
    <div style="margin-top: 30%;position: absolute">
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
             aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">绑定接口</h4>
                    </div>
                    <div class="modal-body">
                        <select id="bindInterfaceId" style="margin-left: 30%" class="bootstrap-select"></select>
                    </div>
                    <div class="modal-footer">
                        <input  type="hidden" name="interfaceId" id="interfaceId" value="${interfaceId!}">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" id="btn_bindInterfaceSubmit" class="btn btn-primary">提交更改</button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
        </div>
    </div>
</div>
</body>

<script type="text/javascript">
    $(document).ready(function() {
        $("#alertMsg").hide();
        //1.初始化Table
        var oTable = new TableInit();
        oTable.Init();

        //2.初始化Button的点击事件
        var oButtonInit = new ButtonInit();
        oButtonInit.Init();

    });
    var TableInit = function () {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function () {
            $('#dataTable').bootstrapTable({
                url: '/testCaseController/getTestCase',         //请求后台的URL（*）
                method: 'get',                      //请求方式（*）
                toolbar: '#toolbar',                //工具按钮用哪个容器
                striped: true,                      //是否显示行间隔色
                cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,                   //是否显示分页（*）
                sortable: false,                     //是否启用排序
                sortOrder: "asc",                   //排序方式
                queryParams: oTableInit.queryParams,//传递参数（*）
                sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
                pageNumber: 1,                       //初始化加载第一页，默认第一页
                pageSize: 10,                       //每页的记录行数（*）
                pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
                search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                strictSearch: false,
                showColumns: false,                  //是否显示所有的列
                showRefresh: true,                  //是否显示刷新按钮
                minimumCountColumns: 2,             //最少允许的列数
                clickToSelect: true,                //是否启用点击选中行
                height: 550,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
                uniqueId: "id",        //每一行的唯一标识，一般为主键列
                showToggle: false,                    //是否显示详细视图和列表视图的切换按钮
                cardView: false,                    //是否显示详细视图
                detailView: false,                   //是否显示父子表
                columns: [
                    {
                        checkbox: true
                    },
                    {
                        field: 'testCaseName',
                        title: '用例名称'
                    },
                    {
                        field: 'paramKeyValue',
                        title: 'keyValue入参'
                    },{
                        field: 'paramValue',
                        title: 'body入参'
                    }, {
                        field: 'expectResult',
                        title: '预期结果',
                        formatter: function (value) {
                            var str;
                            if (null != value) {
                                str = value.replace(new RegExp("<", "g"), "&lt;").replace(new RegExp(">", "g"), "&gt;");
                            } else {
                                str = value;
                            }
                            return str;
                        }
                    }]
            });
        };

        //得到查询的参数
        oTableInit.queryParams = function (params) {
            var interfaceId=$("#interfaceId").val();
            var temp = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                pageSize: params.limit,   //页面大小
                pageNo: params.offset,  //页码
                testCaseName: $("#testCaseName").val(),
                interfaceId:interfaceId
            };
            return temp;
        };
        return oTableInit;
    };


    var ButtonInit = function () {
        var oInit = new Object();
        oInit.Init = function () {
            $("#btn_add").click(function () {
                var projectId = $("#selectProject").children('option:selected').val();
                window.location.href = "${base}/testCaseController/editTestCasePage?interfaceType=" + $("#interfaceType").val() + "&projectId=" + projectId;
            });

            $("#btn_edit").click(function () {
                var arrselections = $("#dataTable").bootstrapTable('getSelections');
                if (arrselections.length > 1) {
                    toastr.warning('只能选择一行进行编辑');
                    return;
                }
                if (arrselections.length <= 0) {
                    toastr.warning('请选择有效数据');
                    return;
                }
                window.location.href =
                        "${base}/testCaseController/editTestCasePage?testCaseId=" + arrselections[0].testCaseId;
            });

            $("#btn_delete").click(function () {
                var arrselections = $("#dataTable").bootstrapTable('getSelections');
                if (arrselections.length <= 0) {
                    toastr.warning('请选择有效数据');
                    return;
                }

                Ewin.confirm({message: "确认要删除选择的数据吗？"}).on(function (e) {
                    if (!e) {
                        return;
                    }
                    $.ajax({
                        type: "post",
                        url: "${base}/testCaseController/deleteTestCase",
                        data: {testCaseId: arrselections[0].testCaseId},
                        success: function (result) {
                            if (result.success) {
                                toastr.success('删除数据成功');
                                $("#dataTable").bootstrapTable('refresh');
                            } else {
                                $("#alertMsg").show();
                                $(".modal-body").text(result.msg);
                                $("#myModal").modal();
                            }
                        },
                        error: function () {
                            toastr.error('Error');
                        },
                        complete: function () {

                        }

                    });
                });
            });

            $("#btn_query").click(function () {
                $("#dataTable").bootstrapTable('refresh');
            });

            $("#btn_back").click(function () {
                window.location.href = "${base}/interfaceTestController/interfaceTestPage?projectId=" + projectId;
            })

            $("#btn_runTest").click(function () {
                var arrselections = $("#dataTable").bootstrapTable('getSelections');
                if (arrselections.length <= 0) {
                    toastr.warning('请选择有效数据');
                    return;
                }
                var caseIds = [];
                for (var i = 0; i < arrselections.length; i++) {
                    caseIds.push(arrselections[i].testCaseId)
                }
                runTest.runTestByCase($("#interfaceId").val(),caseIds);
            });
        }
        return oInit;
    };
</script>